<!--
 * @Author: Mcc
 * @Date: 2024-07-10 10:05:02
 * @LastEditors: mcc 550539422@qq.com
 * @LastEditTime: 2024-08-23 21:00:13
 * @FilePath: \ft-apply\src\App.vue
 * @Description: 
 * 
 * Copyright (c) 2024 by Mcc, All Rights Reserved. 
-->
<template>
  <RouterView>
    <template #default="{ Component, route }">
      <transition :name="shouldHideHeader ? 'van-fade' : 'van-slide-up'">
        <div v-if="!shouldHideHeader">
          <Header />
        </div>
      </transition>
      <component :is="Component" />
    </template>
  </RouterView>
</template>
<script setup lang="ts">
// function redirectToDeviceSpecificSite() {
//   const userAgent = navigator.userAgent.toLowerCase();
//   const isMobile = /iphone|ipad|ipod|android|blackberry|mini|windows\sce|palm/i.test(
//     userAgent
//   );
//   if (!isMobile) {
//     window.location.href =
//       'https://kj.fangtian.me/get/url/webApplicationForJob/index1.html#/'; // 替换为你的移动端网址
//   }
// }
// redirectToDeviceSpecificSite()
import Header from './components/Header.vue';
import Transition from 'vant';
import { ref, onMounted, onBeforeUnmount, watchEffect } from 'vue';

const shouldHideHeader = ref(false);
const handleScroll = () => {
  const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
  shouldHideHeader.value = scrollTop > 150;
};

onMounted(() => {
  window.addEventListener('scroll', handleScroll);
});

onBeforeUnmount(() => {
  window.removeEventListener('scroll', handleScroll);
});

// 如果需要的话，可以在这里添加对路由变化的监听
watchEffect(() => {
  // 清除滚动状态当用户导航到一个新页面
  shouldHideHeader.value = false;
});
</script>
<style lang="less" scoped>
#app {
  width: 100vw;
  height: 100vh;
  overflow: auto;
  overflow-x: hidden;
  background: #f5f5f5;
}

/* 阿里字体图标设置 */
.icon,
.iconfont {
  //font-family: "iconfont" !important;//不一定非要选他，也可以用自带的
  font-size: 24px !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}
</style>
